<template>
	<view class="question">
		<view class="content">
			<view class="title">
				<text></text>
				<image src="https://miaoyao-oss.oss-cn-hangzhou.aliyuncs.com/goFishing/questionCJWT.png"
					mode="scaleToFill"></image>
				<text></text>
			</view>
			<view class="qList" v-for="(v,i) in userInfo" :key="i">
				<view class="key">
					<image src="https://miaoyao-oss.oss-cn-hangzhou.aliyuncs.com/goFishing/questionIcon1.png"
						mode="scaleToFill"></image>
					<view>{{v.key}}</view>
				</view>
				<view class="value">
					<image src="https://miaoyao-oss.oss-cn-hangzhou.aliyuncs.com/goFishing/questionIcon2.png"
						mode="scaleToFill"></image>
					<view>{{v.value}}</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script setup>
	import {
		ref,
		onMounted,
		getCurrentInstance
	} from 'vue'

	const {
		proxy
	} = getCurrentInstance()

	const userInfo = ref([{
		key: "观看一次广告后，收益情况如何？",
		value: "每次浏览该广告，用户可以获得1-2毛的收益。",
	}, {
		key: "会员开通后，会员的收益是如何进行核算的？",
		value: "购买周卡后，您将获得的收益为4.13元；而选择月卡，则收益为6.93元。",
	}, {
		key: "什么时候可以对收益进行结算？",
		value: "广告收益通常在次日晚上12点左右进行结算，而会员收益则会进行实时结算",
	}, {
		key: "提现款项需要多长时间才能到达账户？",
		value: "提现通常可实现实时到账。如遇未到账情况，请及时联系客服进行处理。",
	}, {
		key: "进行提现是否需要支付一定的手续费用？",
		value: "钓点日记小程序本身不向用户收取提现手续费，但用户通过第三方提现平台进行提现时，该第三方平台会收取6.5%的手续费，该费用中已包含了个税代扣代缴以及相关的服务费。",
	}, {
		key: "观看广告会产生哪些影响？",
		value: "该平台配备有高效的防作弊系统，一旦检测到刷广告行为，不仅无法获得任何收益，用户的账号还将面临封禁处理，并可能因此承担法律责任。",
	}, {
		key: "流量会对收益产生什么影响吗？",
		value: "钓点日记主要聚焦于同城钓点的分享功能。经过验证，若账号的流量主要来自同城用户，那么其使用几乎不会受到影响。然而，如果账号的流量覆盖全国范围，建议在使用时务必谨慎。",
	}, ])
</script>

<style scoped lang="scss">
	.question {
		width: 100%;
		min-height: 100vh;
		background: url("https://miaoyao-oss.oss-cn-hangzhou.aliyuncs.com/goFishing/questionBack.png") no-repeat;
		background-size: 100%;
		padding-top: 376rpx;
		box-sizing: border-box;

		.content {
			width: 100%;
			background: rgba(255, 255, 255, 0.5);
			border: 2rpx solid;
			border-radius: 40rpx 40rpx 0rpx 0rpx;
			border-image: linear-gradient(180deg, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0)) 2 2;
			box-sizing: border-box;
			padding: 0 32rpx 32rpx;

			.title {
				display: flex;
				align-items: center;
				justify-content: center;
				width: 100%;
				height: 112rpx;

				text {
					width: 12rpx;
					height: 12rpx;
					background: #04666E;
					border-radius: 50%;
				}

				image {
					width: 162rpx;
					height: 48rpx;
					margin: 0 12rpx;
				}
			}

			.qList {
				width: 100%;
				background: #FFFFFF;
				border-radius: 24rpx 24rpx 24rpx 24rpx;
				padding: 32rpx 24rpx;
				box-sizing: border-box;
				margin-bottom: 16rpx;

				.key {
					display: flex;
					justify-content: space-between;
					margin-bottom: 28rpx;

					image {
						width: 32rpx;
						height: 32rpx;
					}

					view {
						width: 594rpx;
						font-weight: bold;
						font-size: 24rpx;
						color: #04666E;
					}
				}

				.value {
					display: flex;
					justify-content: space-between;

					image {
						width: 32rpx;
						height: 32rpx;
					}

					view {
						width: 594rpx;
						font-weight: 500;
						font-size: 20rpx;
						color: #04666E;
						line-height: 30rpx;
						// text-align: justified;
					}
				}
			}
		}
	}
</style>